﻿@{
    ViewBag.Title = "成本申请";
    var cusList = ViewBag.CustomerList as IEnumerable<CubicFWNet.Data.Models.Customer>;
    var proList = ViewBag.ProductList as IEnumerable<CubicFWNet.Data.ViewModal.ProductView>;
    var salerList = ViewBag.SalerList as IEnumerable<CubicFWNet.Data.Models.User>;
    var customer = ViewBag.Customer as CubicFWNet.Data.Models.Customer;
}


<section class="content-header">
    <h1>
        成本申请
    </h1>
    <ol class="breadcrumb">
        <li><a href="javascript:void(0);"><i class="fa fa-dashboard"></i>@Resources.Global.PageTitle</a></li>
        <li><a href="@Url.Action("Index","Home")">首页</a></li>
        <li class="active">成本申请</li>
    </ol>
</section>

<section class="content">
    <form class="form-horizontal" method="post" id="formMain">
        <div class="box box-solid">
            <div class="box-body">
                <div class="row">
                    <input type="hidden" name="CusID" id="CusID" value="@customer.Id" />
                    <input type="hidden" name="ProData" id="ProData" />
                    <div class="form-group col-md-6 col-sm-12">
                        <label for="ProductName" class="col-sm-3 control-label">选择客户</label>
                        <div class="col-sm-9">
                            <span class="btn btn-primary" onclick="ShowCusList()">选择客户</span>
                        </div>
                    </div>
                    <div class="form-group col-md-6 col-sm-12">
                        <label for="Number" class="col-sm-3 control-label">客户信息</label>
                        <div class="col-sm-9" >
                            @if (customer != null)
                            {
                           <span onclick="ShowModal('@customer.Id')" name="CustomerName" id="CustomerName" class="form-control linkLayout"  >@customer.Name</span>
                            }
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="form-group col-md-6 col-sm-12">
                        <label for="Effect" class="col-sm-3 control-label">选择产品</label>
                        <div class="col-sm-9 ">
                            <span class="btn btn-primary" onclick="ShowProList()">选择产品</span>
                        </div>
                    </div>
                </div>

                <div id="divProList">
                </div>

                <div class="row">
                    @*<div class="form-group col-md-6 col-sm-12">
                        <label for="Number" class="col-sm-3 control-label">订单编号</label>
                        <div class="col-sm-9">
                            <input type="text" class="form-control" id="Number" name="Number" />
                        </div>
                    </div>

                    <div class="form-group col-md-6 col-sm-12">
                        <label for="Delivery" class="col-sm-3 control-label">发货方式</label>
                        <div class="col-sm-9">
                            <input type="text" class="form-control" id="Delivery" name="Delivery" />
                        </div>
                    </div>

                    <div class="form-group col-md-6 col-sm-12">
                        <label for="Channel" class="col-sm-3 control-label">订货途径</label>
                        <div class="col-sm-9">
                            <input type="text" class="form-control" id="Channel" name="Channel" />
                        </div>
                    </div>*@

                    <div class="form-group col-md-6 col-sm-12" style="display:none">
                        <label for="Saler" class="col-sm-3 control-label">销售员</label>
                        <div class="col-sm-9">
                            <select class="form-control" id="Saler" name="Saler">
                                @if (null != salerList)
                                {
                                    foreach (var item in salerList)
                                    {
                                        <option value="@item.Id">@item.RealName</option>
                                    }
                                }
                            </select>
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="form-group col-md-6 col-sm-12">
                        <label for="Memo" class="col-sm-3 control-label">备注</label>
                        <div class="col-sm-9">
                            <textarea rows="3" class="form-control" id="Memo" name="Memo"></textarea>
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="form-group col-md-6 col-sm-12">
                        <label for="Creator" class="col-sm-3 control-label">创建人</label>
                        <div class="col-sm-9">
                            <input type="text" class="form-control" id="Creator" name="Tolerance" value="@ViewBag.RealName" readonly="readonly" />
                        </div>
                    </div>
                    <div class="form-group col-md-6 col-sm-12">
                        <label for="CreateTime" class="col-sm-3 control-label">创建时间</label>
                        <div class="col-sm-9">
                            <input type="text" class="form-control" id="CreateTime" value="@DateTime.Now.ToString("yyyy-MM-dd HH:mm")" readonly="readonly" />
                        </div>
                    </div>
                </div>

            </div>
            <div class="box-footer">
                <div class="box-footer">
                    <span class="btn btn-primary " id="btnOk" onclick="FormSub()">确 定</span>&nbsp;&nbsp;&nbsp;&nbsp;
                    <label class="danger">@ViewBag.Info</label>
                    <div class="text-red" style="margin-top:20px;font-weight:bold">下一步：工艺管理-->工艺核算</div>
                </div>
            </div>
        </div>
    </form>
</section>


<!--选择客户-->
<div class="modal" id="cusList" style="display: none">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">选择客户</h4>
            </div>
            <div class="modal-body">
                <div id="List">
                    <div class="input-group">
                        <span class="input-group-btn">
                            <span class="btn btn-default btn-flat" onclick="SearchCus()"> 搜 索 </span>
                        </span>
                        <input type="text" class="form-control" id="SearchCusName" name="SearchCusName" placeholder="请输入名称" onkeyup="SearchCus()" />
                    </div><br />
                    @foreach (var item in cusList)
                    {
                        if (item.Id.ToString() == ViewBag.CustomerID)
                        {
                            <span class="btn customerItem btn-primary" data-cusID="@item.Id" data-sel="1" style="margin:8px">@item.Name</span>
                        }
                        else
                        {
                        <span class="btn btn-default customerItem" data-cusID="@item.Id" data-sel="0" style="margin:8px">@item.Name</span>
                        }
                    }
                </div>
            </div>
            <div class="modal-footer">
                <a role="button" class="btn btn-default pull-left" data-dismiss="modal">关闭</a>
            </div>
        </div>
    </div>
</div>

<!--选择产品-->
<div class="modal" id="proList" style="display: none">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">选择产品</h4>
            </div>
            <div class="modal-body">
                <div id="cusProList">
                    <div class="input-group">
                        <span class="input-group-btn">
                            <span class="btn btn-default btn-flat" onclick="Search()"> 搜 索 </span>
                        </span>
                        <input type="text" class="form-control" id="SearchName" name="SearchName" placeholder="请输入名称" onkeyup="Search()" />
                    </div><br />

                    @if (proList != null)
                    {
                        foreach (var item in proList)
                        { 
                        <span class="btn btn-default productItem" data-proID="@item.Id"  data-sel="0" data-price="@item.Price" data-cprice="@item.PriceCustomer" data-cname="@item.ProductByName" style="margin:8px">@item.Name</span>
                        }
                    }
                </div>
            </div>
            <div class="modal-footer">
                <a role="button" class="btn btn-default pull-left" data-dismiss="modal">关闭</a>
                <a role="button" class="btn btn-primary" data-dismiss="modal">完成</a>
            </div>
        </div>
    </div>
</div>

@section Scripts {
    <script>
        //选择客户弹窗
        function ShowCusList() {
            $("#cusList").modal();
        }

        //点击选择客户
        $(".customerItem").click(function () {
            var id = $(this).attr("data-cusID");
            location.href = "ApplyAdd?CID="+id;
        });

        //弹窗显示客户信息
        function ShowModal(id) {
            var options = {
                id: null,
                title: '客户信息',
                width: "100%",
                height: "100%",
                url: "../Customer/Info?CID=" + id,
                shade: 0.3,
                btn: ['返回'],
                btnclass: ['btn btn-danger'],
                callBack: null
            }
            $.modalOpen(options);
        }

        //搜索客户
        function SearchCus() {
            var name = $("#SearchCusName").val().trim();

            var list = $("#List .customerItem");
            var num = list.size();

            for (var i = 0; i < num; i++) {
                var sName = $("#List .customerItem").eq(i).html();
                if (sName.indexOf(name) >= 0) {
                    $("#List .customerItem").eq(i).show();
                }
                else {
                    $("#List .customerItem").eq(i).hide();
                }
            }
        }

        //选择产品弹窗
        function ShowProList() {
            var cusName = $("#CustomerName").html();
            if (cusName == "" || cusName == null) {
                $.modalAlert("请先选择客户", "warning");
                return false;
            }
            
            $("#proList").modal();
        }

        //点击选择产品
        $(".productItem").click(function () {
            var name = $(this).html();
            var id = $(this).attr("data-proID");
            var price = $(this).attr("data-price");
            var isSel = $(this).attr("data-sel");
            var cPrice = $(this).attr("data-cprice");
            if (cPrice == 0)
            {
                cPrice = price;
            }
            var cName = $(this).attr("data-cName");
            if (isSel == "1") {
                $("#" + id).remove();
                $(this).removeClass("btn-primary");
                $(this).addClass("btn-default");
                $(this).attr("data-sel", "0");
            }
            else {
                var html = "";
                html += "<div class=\"row panelLayout\" id=\"" + id + "\">";

                html += "<div class=\"form-group col-md-6 col-sm-12\">";
                html += "<label  class=\"col-sm-3 control-label\">产品名称</label>";
                html += "<div class=\"col-sm-9 \"><span class=\"form-control linkLayout\" onclick=\"ShowProModal('" + id + "')\">" + name + "</span></div>";
                html += "</div>";

                html += "<div class=\"form-group col-md-6 col-sm-12\">";
                html += "<label  class=\"col-sm-3 control-label\">客户产品名称</label>";
                html += "<div class=\"col-sm-9 \"><span class=\"form-control txtLayout\">"+cName+"</span></div>";
                html += "</div>";

                html += "<div class=\"form-group col-md-6 col-sm-12\">";
                html += "<label  class=\"col-sm-3 control-label\">购买数量</label>";
                html += "<div class=\"col-sm-9 \"><input type=\"number\" class=\"form-control proCount\" value=\"1\"  /></div>";
                html += "</div>";

                html += "<div class=\"form-group col-md-6 col-sm-12\">";
                html += "<label  class=\"col-sm-3 control-label\">价格</label>";
                html += "<div class=\"col-sm-9 \"><input type=\"number\" class=\"form-control proPrice\"  value=\"" + cPrice + "\"  readonly /></div>";
                html += "</div>";

                html += "</div>";

                $("#divProList").append(html);
                $(this).addClass("btn-primary");
                $(this).removeClass("btn-default");
                $(this).attr("data-sel", "1");
            }
        });

        //弹窗显示产品信息
        function ShowProModal(id) {
            var options = {
                id: null,
                title: '产品信息',
                width: "100%",
                height: "100%",
                url: "../Product/Info?PID=" + id,
                shade: 0.3,
                btn: ['返回'],
                btnclass: ['btn btn-danger'],
                callBack: null
            }
            $.modalOpen(options);
        }

        //搜索产品
        function Search() {
            var name = $("#SearchName").val().trim();

            var list = $("#cusProList .productItem");
            var num = list.size();

            for (var i = 0; i < num; i++) {
                var sName = $("#cusProList .productItem").eq(i).html();
                if (sName.indexOf(name) >= 0) {
                    $("#cusProList .productItem").eq(i).show();
                }
                else {
                    $("#cusProList .productItem").eq(i).hide();
                }
            }
        }

        //提交表单
        function FormSub() {
            var cusName = $("#CustomerName").html();
            if (cusName == "" || cusName == null) {
                $.modalAlert("请选择客户", "warning");
                return false;
            }

            //获取并验证产品列表
            var proList = $("#divProList .panelLayout");
            var prodata = [];
            var num = proList.size();
            if (num < 1) {
                $.modalAlert("请选择产品", "warning");
                return false;
            }
            else {
                for (i = 0; i < num; i++) {
                    var id = proList.eq(i).attr("id");
                    var amount = $(".proCount").eq(i).val();
                    var price = $(".proPrice").eq(i).val();
                    prodata.push({ PID: id, Amount: amount, Price:price });
                }
            }
            $("#ProData").val(JSON.stringify(prodata));

            //验证订单号
            //var number = $("#Number").val().trim();
            //if (number == "") {
            //    $.modalAlert("请输入订单编号", "warning");
            //    return false;
            //}

            //var sal = $("#Saler").val();
            //if (null == sal || sal == "") {
            //    $.modalAlert("请选择我方销售员", "warning");
            //    return false;
            //}
            $("#btnOk").attr('disabled', "true")
            $("#formMain").submit();
        }
    </script>
}